<template>
  <div class="main">
    <!-- <a-cascader
      :options="areaData"
      expand-trigger="hover"
      :style="{ width: '320px' }"
      placeholder="Please select ..."
      :field-names="fieldNames"
      v-model="data"
      @change="change"
    />
    {{ aa ?? 'dsfsdf' }}
    <a-button @click="aaa">点我</a-button>
    <div class="aaaaa"><div id="sub-container"></div></div> -->
  </div>
</template>
<script setup lang="ts">
// import areaData from '@/assets/json/pca-code.json';
// import clonedeep from 'lodash.clonedeep';
// import { start } from 'qiankun';
// import { registerApps } from '@/utils/qiankun';

// const test = ref('总集其他内容');
// const aa = ref<null | string>(null);
// const aaa = () => {
//   aa.value ? (aa.value = null) : (aa.value = '出现');
// };
// onMounted(() => {
//   if (!window.qiankunStarted) {
//     window.qiankunStarted = true;
//     registerApps();
//     start({
//       sandbox: {
//         experimentalStyleIsolation: true // 样式隔离
//       }
//     });
//   }
// });

// const mock = [
//   {
//     id: 1,
//     type: 1,
//     name: '发起人',
//     pre: 0,
//     details: [
//       {
//         pre: 0,
//         next: 2
//       },
//       {
//         pre: 0,
//         next: 3
//       }
//     ]
//   },
//   {
//     id: 2,
//     type: 2,
//     name: '条件1',
//     pre: 1,
//     details: [
//       {
//         pre: 1,
//         next: 4
//       }
//     ]
//   },
//   {
//     id: 3,
//     type: 2,
//     name: '条件2',
//     pre: 1,
//     details: [
//       {
//         pre: 1,
//         next: 7
//       }
//     ]
//   },
//   {
//     id: 4,
//     type: 3,
//     name: '审核人1',
//     pre: 2,
//     details: [
//       {
//         pre: 2,
//         next: 5
//       },
//       {
//         pre: 2,
//         next: 6
//       }
//     ]
//   },
//   {
//     id: 5,
//     type: 2,
//     name: '条件3',
//     pre: 4,
//     details: [{ pre: 4, next: 7 }]
//   },
//   {
//     id: 6,
//     type: 2,
//     name: '条件4',
//     pre: 4,
//     details: [{ pre: 4, next: 7 }]
//   },
//   {
//     id: 7,
//     type: 3,
//     name: '审核人2',
//     pre: 3,
//     details: [
//       {
//         pre: 3,
//         next: 8
//       },
//       {
//         pre: 5,
//         next: 8
//       },
//       {
//         pre: 6,
//         next: 8
//       }
//     ]
//   },
//   {
//     id: 8,
//     type: 4,
//     name: '结束',
//     pre: 7,
//     details: [
//       {
//         pre: 7,
//         next: 0
//       }
//     ]
//   }
// ];
// const changDataone = (data: any) => {
//   let startId = 0;
//   let index = 0;
//   let next: number[] = [];
//   const processData: any = { childNode: {}, conditionNodes: [] };
//   data.forEach((ele: any, ind: number) => {
//     if (ele.type === 1) {
//       startId = ele.id;
//       processData.name = ele.name;
//       index = ind;
//       ele.details.forEach((item: any) => {
//         next.push(item.next);
//       });
//     }
//   });
//   data.splice(index, 1);
//   processData.childNode = changDatatwo(startId, next, data);
// };
// const changDatatwo = (id: number, next: number[], data: any) => {
//   const oldData = clonedeep(data);
//   let index: number[] = [];
//   let newData: any = [];
//   data.forEach((ele: any, ind: number) => {
//     if (next.indexOf(ele.id) !== -1) {
//       index.push(ind);
//       newData.push(ele);
//     }
//   });
//   index.forEach((ele) => {
//     oldData.splice(ele, 1);
//   });
//   newData.forEach((ele: any) => {
//     // if (ele.type === 3) {
//     // }
//   });
// };
// changDataone(mock);
// console.log('areaData', areaData);
// const fieldNames = { value: 'code', label: 'name' };
// const data: any = ref();
// const change = (e) => {
//   console.log(e, data.value);
// };
</script>
<style lang="less" scoped>
.main {
  width: 100vw;

  height: 100vh;
  display: flex;
  // justify-content: center;
  align-items: center;
}
// #TableTurn {
//   width: 1000px;
// }
.aaaaa {
  width: 1000px;
  height: 1000px;
}
</style>
